import { reactive } from 'vue'

const colors: any = reactive({
  'radio_1a': '#eef4f7',
  'radio_1b': '#eef4f7',
  'radio_1c': '#eef4f7',
  'radio_2': '#eef4f7',
  'radio_3': '#eef4f7',
  'radio_4': '#eef4f7',
  'radio_5a': '#eef4f7',
  'radio_5b': '#eef4f7',
  'radio_6a': '#eef4f7',
  'radio_6b': '#eef4f7',
  'radio_7': '#eef4f7',
  'radio_8': '#eef4f7',
  'radio_9': '#eef4f7',
  'radio_10': '#eef4f7',
  'radio_11': '#eef4f7',
  'radio_16': '#eef4f7',
  'radio_2_l': '#eef4f7',
  'radio_2_r': '#eef4f7',
  'radio_4_l': '#eef4f7',
  'radio_4_r': '#eef4f7',
  'radio_8_l': '#eef4f7',
  'radio_8_r': '#eef4f7',
})

// default
const theme = {
  level1: '#52c41a',
  level2: '#b9d65f',
  level3: '#e0e44e',
  level4: '#ff976a',
  level5: '#ff4d4f',
}

const color0 = [theme.level1, theme.level5]
const color2 = [theme.level1, theme.level3, theme.level5]
const color3 = [theme.level1, theme.level2, theme.level4, theme.level5]
const color4 = [theme.level1, theme.level2, theme.level3, theme.level4, theme.level5]

const setColor = (obj?: any, popupParams?: any) => {
  for (const key in colors) {
    colors[key] = '#eef4f7'
  }
  if (obj) {
    for (const key in obj) {
      const score = obj[key]
      if(score === null) continue
      switch (key) {
        case 'radio-1a':
          colors['radio_1a'] = color3[score]
          break
        case 'radio-1b':
          colors['radio_1b'] = color2[score]
          break
        case 'radio-1c':
          colors['radio_1c'] = color2[score]
          break
        case 'radio-2':
          // 单独处理
          break
        case 'radio-3':
          colors['radio_3'] = color3[score]
          break
        case 'radio-4':
          // 单独处理
          break
        case 'radio-5a':
          colors['radio_5a'] = color4[score]
          break
        case 'radio-5b':
          colors['radio_5b'] = color4[score]
          break
        case 'radio-6a':
          colors['radio_6a'] = color4[score]
          break
        case 'radio-6b':
          colors['radio_6b'] = color4[score]
          break
        case 'radio-7':
          colors['radio_7'] = color2[score]
          break
        case 'radio-8':
          // 单独处理
          break
        case 'radio-9':
          colors['radio_9'] = color3[score]
          break
        case 'radio-10':
          colors['radio_10'] = color2[score]
          break
        case 'radio-11':
          colors['radio_11'] = color2[score]
          break
        case 'radio-16':
          colors['radio_16'] = color0[score]
          break
        default:
          break
      }
    }
    popupParamsHandler(obj, popupParams)
  }
  return colors
}

// 交叉凝视和交叉面瘫需要额外增加一个算法：
// 1、5a左上肢得分+6a左下肢得分＞5b右上肢得分+6b左下肢得分，如果选择向右凝视或左面瘫，则在向右凝视、左面瘫的区域显示颜色；如果选择向左凝视或右面瘫，则在交叉凝视、交叉面瘫的区域显示颜色
// 2、5a左上肢得分+6a左下肢得分=5b右上肢得分+6b左下肢得分，无论选择哪种凝视和面瘫显示选择哪个均在相应的区域显示颜色
// 3、5a左上肢得分+6a左下肢得分＜5b右上肢得分+6b左下肢得分，如果选择向左凝视或右面瘫，则在向左凝视、右面瘫的区域显示颜色；如果选择向右凝视或左面瘫，则在交叉凝视、交叉面瘫的区域显示颜色
// 也就是说凝视和面瘫显示得分的颜色和肢体显示得分的颜色保持在同一侧（要么都在左侧大脑半球区域，要么都在右侧大脑半球区域），否则就在后循环区域显示得分颜色
const popupParamsHandler = (obj: any, popupParams: any) => {
  if (obj['radio-5a'] && obj['radio-5b'] && obj['radio-6a'] && obj['radio-6b']) {
    const temp = (obj['radio-5a'] + obj['radio-6a']) - (obj['radio-5b'] + obj['radio-6b'])
    const gaze = popupParams?.gaze // 向左凝视2, 向右凝视1
    const face = popupParams?.face // 左侧面瘫1, 右侧面瘫2
    const feel = popupParams?.feel // 左感觉障碍1, 右感觉障碍2
    if (temp > 0) {
      if (gaze === '1' || face === '1') {
        // 如果选择向右凝视或左面瘫，则在向右凝视、左面瘫的区域显示颜色
        colors['radio_2_l'] = color2[obj['radio-2']]
        colors['radio_4_l'] = color3[obj['radio-4']]
      }
      if (gaze === '2' || face === '2') {
        // 如果选择向左凝视或右面瘫，则在交叉凝视、交叉面瘫的区域显示颜色
        colors['radio_2'] = color2[obj['radio-2']]
        colors['radio_4'] = color3[obj['radio-4']]
      }
    } else if (temp === 0) {
      // 无论选择哪种凝视和面瘫显示选择哪个均在相应的区域显示颜色
      if (gaze === '1') {
        colors['radio_2_l'] = color2[obj['radio-2']]
      }
      if (gaze === '2') {
        colors['radio_2_r'] = color2[obj['radio-2']]
      }
      if (face === '1') {
        colors['radio_4_l'] = color2[obj['radio-4']]
      }
      if (face === '2') {
        colors['radio_4_r'] = color2[obj['radio-4']]
      }
    } else if (temp < 0) {
      if (gaze === '2' || face === '2') {
        // 如果选择向左凝视或右面瘫，则在向左凝视、右面瘫的区域显示颜色；
        colors['radio_2_r'] = color2[obj['radio-2']]
        colors['radio_4_r'] = color3[obj['radio-4']]
      }
      if (gaze === '1' || face === '1') {
        // 如果选择向右凝视或左面瘫，则在交叉凝视、交叉面瘫的区域显示颜色
        colors['radio_2'] = color2[obj['radio-2']]
        colors['radio_4'] = color3[obj['radio-4']]
      }
    }

    if (feel === '1') {
      colors['radio_8_l'] = color2[obj['radio-8']]
    }

    if (feel === '2') {
      colors['radio_8_r'] = color2[obj['radio-8']]
    }
  }
}

export { setColor }